/**
 *  @description 自定义权限按钮权限指令：
 *  @author plj
 *  @date 2021年8月20日16:48:43
 *  使用事例：<Button type="success" v-has="['1','2']">测试按钮</Button>
 */
import Vue from 'vue'
import store from '../store'

// 注册局部指令
const has = {
    install (Vue, options) {
        Vue.directive('has', {
            /**
             * @param  el DOM对象
             * @param  binding 属性信息
             * */
            inserted (el, binding) {
                // let btn = store.getters.userBtns; // 此处数据由后台提供
                let btn = ["1","2"]; // 此处数据由后台提供
                console.log("权限按钮："+btn);
                if(!!binding.value && (binding.value instanceof Array) && binding.value.length != 0) {
                    let data = binding.value.filter(item => btn.indexOf(item) > -1);
                    if (data.length == 0) {
                        el.parentNode.removeChild(el);
                    }
                }else{// 如果为空，直接移除
                    el.parentNode.removeChild(el);
                }
                // 如果需要动态修改按钮内容，可以放开：el.innerHTML="<i class='el-icon-edit'></i>内容"
            }
        });
    }
};

export default has;

